<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <meta http-equiv="content-language" content="zh-CN">
    <meta content="1 days" name="revisit-after" />
    <meta name="robots" content="all">
    <meta name="viewport" content="width=750, maximum-scale=1.0, user-scalable=no">
    <meta content="yes" name="apple-mobile-web-app-capable" />
    <meta content="black" name="apple-mobile-web-app-status-bar-style" />
    <meta content="telephone=no" name="format-detection" />
    <meta content="false" id="twcClient" name="twcClient" />
    <link rel="stylesheet" href="css/swiper.min.css">
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/my.css">
    <script src="js/common.js"></script>
    <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>
    <script src="js/swiper.min.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <title>我的</title>
</head>

<body>
    <div id="my">
        <header>
            <div class="left">
                <img :src="person.headimgurl" alt="">
            </div>
            <div class="con">
                <div class="row1">{{person.name}}</div>
                <div class="row2">亮度：{{person.credit}}</div>
            </div>
            <div class="right" @click.stop='change'>

            </div>
        </header>
        <main>
            <ul>
                <li @click.stop="goInter">亮度</li>
                <li @click.stop="goMember">加入会员</li>
                <li @click.stop="goCou">我的劵</li>
                <li @click.stop="goNew">好消息</li>
                <li @click.stop="goAbout">关于我们</li>
            </ul>
        </main>
        <footer>
            <div class="pic">
                <img src="images/code.png" alt="">
            </div>
            <div class="row1">长按识别二维码联系客服</div>
            <div class="row2">客服电话：
                <a href="tel:13126887722">13126887722</a>
            </div>
        </footer>
        <transition name="slide-fade">
            <div class="exchange" v-if="exChange" @touchmove.prevent>
                <div class="contain">
                    <div class="top"></div>
                    <div class="close" @click.stop="close"></div>
                    <input type="number" class="number" @focus="focus" @blur="blur" v-model="credit" placeholder="请输入您兑换的亮度">
                    <input type="text" class="indent" @focus="focus" @blur="blur" v-model="indent" placeholder="请输入您的身份证号">
                    <button class="make" @click.stop="make">生成券</button>
                </div>
            </div>
        </transition>
        <transition name="slide-fade">
            <div class="alertReg" v-if="msg">
                <div class="con">
                    {{msg}}
                </div>
            </div>
    </transition>
    </div>
</body>

</html>
<script>
    var app4 = new Vue({
        el: '#my',
        data() {
            return {
                exChange: false,
                person: '',
                indent: '',
                credit: '',
                access_token: '',
                SetFun: '',
                reg: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,
                reg1: /(^[0-9]*$)/,
                reg2:/^[A-Za-z0-9]+$/,
                msg:''
            };
        },
        methods: {
            mo(e) { e.preventDefault() },
            change() {
                this.exChange = true;
                document.documentElement.scrollTop = document.body.scrollTop = 0;
            },
            close() {
                this.exChange = false;
            },
            goInter() {
                location.href = "intergral.html"
            },
            goCou() {
                location.href = "coupon.html"
            },
            focus() {
                // document.documentElement.scrollTop = document.body.scrollTop = 'auto';
            },
            blur(){
                document.documentElement.scrollTop = document.body.scrollTop = 0;
            },
            goNew() {
                location.href = "goodNews.html"
            },
            goAbout() {
                location.href = "http://www.2020-2020.com/blank-1"
            },
            goMember() {
                location.href = "member.html"
            },
            make() {
                if (!this.reg.test(this.indent)){
                    this.msg= '请输入正确的身份证号～';
                    let _self = this;
                    setTimeout(function(){
                    _self.msg = ''
                    },500)
                }else if(!this.reg1.test(this.credit)){
                    this.msg = '请输入正确的亮度值～'
                    let _self = this;
                    setTimeout(function(){
                    _self.msg = ''
                    },500)
                }else {
                    var _self = this;
                    axios.post('http://airen.2020-2020.com/v1/tickets', {
                        'access_token': _self.access_token,
                        'credit': _self.credit,
                        'identity_card': _self.indent
                    })
                    .then((res) => {
                        console.log(res.data);
                        if(res.data.error == -12104){
                            _self.msg = '兑换亮度超出现有亮度～'
                            setTimeout(function(){
                            _self.msg = ''
                            },500)  
                        }else{
                            location.href = 'coupon.html';
                        }
                        
                    })
                }

            },

            reload() {
                window.location= 'my.html';
            },
            getInfo() {
                var _self = this;
                var access_token = localStorage.getItem('access_token');
                this.access_token = access_token;
                if (access_token) {
                    axios.get("http://airen.2020-2020.com/v1/users?access_token=" + access_token)
                        .then(function (res) {
                            _self.person = res.data.data;
                            console.log(_self.person)
                        })
                        .catch(function (err) {
                            var status = err.toString().replace(/[^0-9]/ig, "");
                            if (status == 402) {
                                _self.SetFun.isCode(_self.reload);
                            }
                        })
                } else {
                    _self.SetFun.isCode(_self.reload);
                }
            }
        },
        watch: {
            indent: function (indent) {          
            if (!this.reg2.test(indent)) {
                this.msg= '请输入正确的身份证号～';
                let _self = this;
                setTimeout(function(){
                    _self.msg = ''
                    },500)
                }
            }
        },
        created() {

        },
        mounted() {
            var _self = this;
            _self.SetFun = new window.SetFun();
            _self.getInfo();
            _self.SetFun.hideMenu();
        }
    })
</script>